<script lang="ts">
  export let cards: { title: string; value: string | number}[] =
    [];
</script>

<div class="flex gap-2 w-full">
  {#each cards as card}
    <div class="bg-[#0C162C] border border-[#24324A] rounded px-3 py-2 text-white flex-1">
      <div class="text-[16px] text-gray-400 mb-1">{card.title}</div>
      <div class="flex items-baseline">
        <span class="text-[18px] font-bold">{card.value}</span>
      </div>
    </div>
  {/each}
</div>
